﻿<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>
			文章管理
		</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<link rel="stylesheet" href="./../../static/back/css/x-admin.css" media="all">
		
	</head>

	<body>
		<div style="padding:5px 15px;">
			<fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
				<legend>新增文章</legend>
			</fieldset>
			 
		<form class="layui-form" action="" lay-filter="myfrm" id="frm">
        {% csrf_token %}
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">标题</label>
					<div class="layui-input-inline">
						<input type="text" name="title" lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input" />
					</div>
					<div class="layui-form-mid layui-word-aux">请输入标题</div>
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">标签</label>
					<div class="layui-input-inline">
						<select id="cc" name="tags">
						<option value="">请选择</option>
						{% for foo in tagslist %}
						  <option value="{{ foo.tags }}">{{ foo.tags }}</option>
						{% endfor %}
					</select>
					</div>

				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">简介</label>
				<div class="layui-input-block">
					<textarea name="simpleinfo" placeholder="请输入简介" lay-verify="required" class="layui-textarea"></textarea>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">内容</label>
				<div class="layui-input-block">
					<textarea name="cont" placeholder="请输入内容" lay-verify="required" class="layui-textarea"></textarea>
				</div>
			</div>
			<div class="layui-form-item" id="imgPreview" style="display: none;">
				<div class="layui-input-block">
					<img id="imgPhoto" class="layui-upload-img" style="width:180px; height:140px" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">上传图片</label>
				<div class="layui-input-block">
					<input id="uploadImg" type="file" name="myFile">
					<input id="photoUrl" name="PicUrl" type="hidden" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">来源</label>
				<div class="layui-input-inline">
					<input type="text" name="source" placeholder="请输入来源" lay-verify="required" autocomplete="off" class="layui-input" />
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">文章分类</label>
					<div class="layui-input-inline">
						<select id="type" name="type">
						<option value="">请选择</option>
						{% for foo in typelist %}
						  <option value="{{ foo.type }}">{{ foo.type }}</option>
						{% endfor %}


					</select>
					</div>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">是否发布</label>
				<div class="layui-input-block">
					<input type="checkbox" checked="" name="ispub" lay-skin="switch" lay-filter="switchTest" lay-text="是|否">
				</div>
			</div>
			
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit="" lay-filter="add">立即提交</button>
				</div>
			</div>
		</form>

		</div>
		<script src="../../../static/back/lib/layui/layui.js" charset="utf-8"></script>
        <script src="../../../static/back/js/x-layui.js" charset="utf-8"></script>
		<script>
			layui.use(['form','layer','upload','jquery'], function(){
                    var form=layui.form,
                        layer=layui.layer,
                        upload=layui.upload,
                        $=layui.$;
                    upload.render({
                        elem:'#uploadImg'//绑定元素，指向容器的选择器
                        ,url:'/back/upload'//上传服务器接口
                        ,done:function (res) {
                            //上传完毕回调函数，res  服务器响应的信息
                            if(res.success){
                                $("#imgPreview").css('display','block')  //设置样式
                                $('#imgPhoto').attr('src','../../../static/back/'+res.remark)//设置属性
                                $('#photoUrl').val(res.remark)//在隐藏域中赋值图片上传的绝对路径
                                layer.msg('上传成功')
                            }else{
                                layer.msg(res.message)
                            }
                        }
                    })
                form.on('submit(add)',function () {
                    var url='/back/addArticle';
                    var param=$('#frm').serialize()
                    $.post(url,param,function (res) {
                        //res 服务器响应的数据
                        if(res.success){
                            layer.msg('添加成功')
                            parent.layer.close(layer.index);
                            window.parent.location.reload();
                        }else{
                            layer.msg(res.message)
                        }
                    },'json')


                    return false;
                })
            });
		</script>